<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>App Deploy</title>
    <link rel="stylesheet" href="static/css/bootstrap.min.css">
    <link rel="stylesheet" href="static/css/index.css">
</head>
<body>
	<div class="container-fluid" style="margin-top: 20px;">
	<ol class="breadcrumb">
		<li class="active">Applications</li>
		<div class="pull-right">
			<span class="label label-info">Undeploy</span>
			<span class="label label-success">Deployed</span>
		</div>
	</ol>
	<div id="panel-container" class="panel panel-default" style="overflow: auto;">
		<div class="panel-body">
			<div class="row">
				<div class="col-sm-6 col-md-4 col-lg-3">
					<a href="#addAppModal" class="thumbnail text-center" data-toggle="modal">
						<span class="glyphicon glyphicon-plus"></span>
					</a>
				</div>
				
			</div>
		</div>
	</div>

	<div class="modal fade" id="addAppModal">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h3 class="modal-title">Add new application</h3>
				</div>
				<div class="modal-body">
					<form action="" class="form-horizontal">
						<div class="form-group">
							<label for="" class="col-sm-2 control-label">App name</label>
							<div class="col-sm-10"><input type="text" class="form-control" placeholder="Input app name"></div>
						</div>
						<div class="form-group">
							<label for="" class="col-sm-2 control-label">App description</label>
							<div class="col-sm-10"><textarea class="form-control" rows="10"></textarea></div>
						</div>
						<div class="form-group">
							<label for="" class="col-sm-2 control-label">Deploy url</label>
							<div class="col-sm-10"><input type="text" class="form-control" placeholder="Input deploy url"></div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button class="btn btn-warning" data-dismiss="modal">Cancel</button>
					<button class="btn btn-primary">Save</button>
				</div>
			</div>
		</div>
	</div>

	<div class="modal fade" id="confirmModal">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button class="close" data-dismiss="modal" aria-label="Close">
						<span>&times;</span>
					</button>
					<h3 class="modal-title">Delete App</h3>
				</div>
				<div class="modal-body"></div>
				<div class="modal-footer">
					<button class="btn btn-warning" data-dismiss="modal">Cancel</button>
					<button class="btn btn-primary">OK</button>
				</div>
			</div>
		</div>
	</div>
</div>
    <script src="static/js/jquery-1.11.3.js"></script>	
    <script src="static/js/bootstrap.min.js"></script>	
    <script src="static/js/index.js"></script>	
</body>

</html>